<template>
  <div class="shop-content">


    <router-link :to="'/home/goodsinfo/'+item.id" v-for="item in list" :key="item.id"
     class="shop-list" tag="div">
      <img src="../../img/1.jpg" alt="图片">
      <div class="shop-info">
          <h5>金额vi哦v及金额vi哦v及金额vi哦v及金额vi哦v及</h5>
          <p>
               <span style="color:red">￥999</span>
              <span class="old-price">￥1999</span>
          </p>
          <p>
              <span>热卖中</span>
              <span>剩余100件</span>
          </p>
      </div>
    </router-link>
  </div>
</template>

<script>
import {Toast} from 'mint-ui';

export default {
  data() {
    return {
      list: [
        { title: "iphone8", info: "牛逼" ,id:1},
        { title: "iphone8", info: "牛逼" ,id:2},
        { title: "iphone8", info: "牛逼" ,id:3},
        { title: "iphone8", info: "牛逼" ,id:4},
        { title: "iphone8", info: "牛逼" ,id:5},
        { title: "iphone8", info: "牛逼" ,id:6},
        { title: "iphone8", info: "牛逼" ,id:8},
        { title: "iphone8", info: "牛逼" ,id:9},
        { title: "iphone8", info: "牛逼" ,id:10},
        { title: "iphone8", info: "牛逼" ,id:11},
         { title: "iphone8", info: "牛逼" ,id:12}
      ]
    };
  },
  created() {
   this.initlist()
  },
  methods: {
      initlist(){
        //    this.$http.get("#").then(result=>{
                 
        //    },eror=>{
        //      Toast("网络不假")
        //    })
      }
  }
};
</script>

<style scoped>
.shop-content {
  /* padding: 20px; */
  /* position: relative; */
  padding-bottom: 10px;
}
.shop-list {
  margin-left: 12px;
  margin-top: 10px;
  display: inline-block;
  width: 170px;
  height: 280px;
  border: 1px solid white;
  box-shadow: 0 0 8px #999;
  /* position: absolute; */
}
.shop-list img{
    width: 100%;
}

.old-price{
    text-decoration: line-through;
}
</style>
